<template>
  <div>
    <Header title="供应商管理"></Header>
    <div class="Order">
      <operate :isAddShow="isAddShow" :isSeniorShow="isSeniorShow"></operate>
      <table cellspacing="0">
        <tr>
          <th>编码</th>
          <th>供应商名称</th>
          <th>联系人</th>
          <th>联系电话</th>
          <th>所属区域</th>
          <th>详细地址</th>
          <th>状态</th>
          <th>操作</th>
        </tr>
        <tr v-for="(item, index) in supllierList" :key="item.id" ref="del">
          <td v-for="(value, key) in item" :key="key">{{ value }}</td>
          <td>
            <span @click="goCheck(index)">查看</span
            ><span @click="goUpdate(index)">修改</span>
            <el-button type="text" @click="del(index)" class="del"
              >删除</el-button
            >
          </td>
        </tr>
        <tr>
          <td colspan="9" style="border: 0; color: #000">
            <Footer></Footer>
          </td>
        </tr>
      </table>
    </div>
  </div>
</template>
<script>
import Header from "@/components/goods/header";
import Footer from "@/components/member/footer";
import operate from "@/components/goods/operate";
export default {
  data() {
    return {
      isAddShow: false,
      isSeniorShow: true,
      supllierList: [],
      code: "",
    };
  },
  filters: {},
  beforeDestroy() {},
  created() {
    this.urrl = "http://120.76.56.2:3001/purcase/purchaseOrder/getsupplierInfo";
    this.renderTable();
  },
  components: {
    Footer,
    Header,
    operate,
  },
  methods: {
    goCheck(index) {
      this.$router.push("/home/purchase/purcaseInfo?");
      this.$store.commit(
        "common/setsupperCode",
        this.$refs.del[index].children[0].innerText
      );
    },
    goUpdate(index) {
      this.$router.push("/home/purchase/purchaseUpdate");
      this.$store.commit(
        "common/setsupperCode",
        this.$refs.del[index].children[0].innerText
      );
    },
    del(index) {
      let code = this.$refs.del[index].children[0].innerText;
      this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.$http
            .post("http://120.76.56.2:3001/purcase/purchaseOrder/del", { code })
            .then((ret) => {
              this.renderTable();
              this.$message({
                type: "success",
                message: "删除成功!",
              });
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    renderTable(option) {
      let list = [];
      this.$http
        .post(
          "http://120.76.56.2:3001/purcase/purchaseOrder/getsupplierInfo",
          option
        )
        .then((ret) => {
          this.$store.commit("common/setTotal", ret.count);
          this.$store.commit("common/setTotalPages", ret.pages);
          ret.data.forEach((item) => {
            list.push({
              code: item.code,
              supplier: item.supplier,
              linkman: item.linkman,
              linkmanNum: item.linkmanNumber,
              area: item.area,
              detailAddres: item.detailAdress,
              state: item.state,
            });
          });
          this.supllierList = list;
        });
    },
  },
  watch: {
    suppliercode: function (val) {
      if (val) {
        this.renderTable({ code: val });
      }
    },
    num: function (val) {
      if (val) {
        this.renderTable({ page: val });
      }
    },
  },
  computed: {
    suppliercode() {
      return this.$store.state.common.code;
    },
    num() {
      return this.$store.state.common.num;
    },
  },
};
</script>
<style lang="scss" scoped>
@import "@/assets/scss/table.scss";
span {
  color: blue;
  font-size: 12px;
  margin: 0 4px;
  cursor: pointer;
}
.del {
  color: blue;
  font-size: 12px;
  margin: 0 4px;
}
</style>
